<template>
  <div>
    <div class="paging">
      <el-pagination
        :current-page="currentPage"
        :page-sizes="pageSizes"
        :page-size="pageSize"
        :layout="layout"
        :total="total"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
      />
    </div>
  </div>
</template>

<script lang="js">
export default {
  name: 'Pagination',
  props: {
    handleSizeChange: Function,
    handleCurrentChange: Function,
    total: Number,
    layout: String
  },
  data() {
    return {
      currentPage: 1, // 当前页码
      pageSizes: [5, 10, 15, 20, 25, 30, 50], // 一页多少条数据
      pageSize: 10 // 每页多少条数据

    }
  },
  methods: {

  }
}
</script>

<style lang="scss" scope>
.paging {
  margin-top: 10px;
  text-align: center;
}
</style>
